import {Image, View} from '@tarojs/components'
import {observer} from 'mobx-react'
import {useEffect} from 'react'
import Taro, {useDidHide, useDidShow, useRouter} from '@tarojs/taro'
import {imagesUrl} from '@/utils/baseUrl'
import ParamRaw from './components'
import {toEchartsSingleParamAnalyze} from '@/utils/pageRedirect'

const Singledevparams: React.FC = (): JSX.Element => {
  let router = useRouter()

  // 可以使用所有的 React Hooks
  useEffect(() => {
    console.log('Singledevparams useEffect', router)
  }, [])
  // 对应 onShow
  useDidShow(() => {
    console.log('Singledevparams useDidShow')
    //获取路由
  })
  // 对应 onHide
  useDidHide(() => {
    console.log('Singledevparams useDidHide')
  })
  return (
    <View className="w-screen h-screen bg-xx_bg flex flex-col overflow-hidden">
      <View className="w-full h-62 pl-24 flex justify-start items-center">
        <Image
          src={imagesUrl + '/icon/device.png'}
          className="w-20 h-20 mr-6"
        ></Image>
        <View className="hanzi flex-1 h-22 text-16 truncate">
          白马体育公园游泳馆
        </View>
      </View>
      <View className="w-full flex-1 overflow-y-auto pb-68">
        {new Array(6).fill(1).map(item => (
          <ParamRaw
            paramName="温度"
            paramStatus="偏高"
            paramUnit=""
            paramValue=""
            time="2022-07-03 16:24:06"
            onClick={() => {
              toEchartsSingleParamAnalyze('')
            }}
          ></ParamRaw>
        ))}
      </View>
    </View>
  )
}
export default observer(Singledevparams)
